<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="css/index.css" />
		<script src="js/vue.min.js"></script>
		<script src="js/elementui.js"></script>
		<script src="js/axios.min.js"></script>
		<script src="js/common.js"></script>


	</head>
	<body>
		<div id="app">
			<el-row>
				<el-col :span="12">&nbsp;
				</el-col>

				<el-col :span="6">
					<el-form :model="user" label-width="80px">
						<el-form-item label="用户名">
							<el-input v-model="user.uname"></el-input>
						</el-form-item>
						<el-form-item label="密码">
							<el-input show-password v-model="user.upwd"></el-input>
						</el-form-item>
						<el-form-item>
							<el-button type="primary" @click="onSubmit">登录</el-button>
							<el-button>取消</el-button>
						</el-form-item>
					</el-form>
				</el-col>
			</el-row>

		</div>

		<script>
			new Vue({
				el: "#app",
				data: {
					user: {
						uname: "",
						upwd: ""
					}
				},
				methods: {
					//登录的方法
					onSubmit() {
						let that=this
						axios.post(API + "login", this.user).
						then(function(res) {
							// alert(JSON.stringify(res))
							if(res.data.code==200){
								let token=res.data.data.token
								//把token存到本地存储
								window.localStorage.setItem("token",token)
								window.location.href="menu.html"
							}else{
								// alert("登录失败")
								that.$message("出错了")
							}

						}).catch(err => {
							console.log(err)
						});

					}
				}

			})
		</script>

	</body>
</html>